@extends('layouts.default')

@section('title', '任教学科')

@push('scripts')
<script src="{{ asset('lib/xm-select-v1.2.4/xm-select.js')}}"></script>
<script>
    layui.use(['layer','form','table','laytpl','laydate','element','laypage'], function(){
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var laytpl = layui.laytpl;
        var laydate = layui.laydate;
        var element = layui.element;
        var laypage = layui.laypage;
        var PageId = "{{request()->get('id',0)}}";
        var xmDemo;
        var cxmDemo;
        var xmGradeDemo;

        renderSelect();

        laydate.render({
            elem: '#start-date'
            ,type: 'date'
        });
        laydate.render({
            elem: '#end-date'
            ,type: 'date'
        });

        //下拉框初始化
        async function renderSelect(){
            await renderDictionarySelect();
            await renderTermSelect();
            await renderCompere();
            // await renderGradesSelect();
            // await renderClassesSelect();
            pageInit();
        }

        //字典下拉框数据渲染
        function renderDictionarySelect() {
            return new Promise((resolve) => {
                getDictionaryItem({'diccode': ['SUBJECT', 'GRADE', 'CLASS']}, function (res){
                    if(res.code === 1) {
                        let data = res.data;

                        for(var k in data) {
                            let key = k.toLowerCase();
                            let d = data[k];

                            $('[data-role='+key+'List]').empty().append('<option value="">请选择</option>');
                            for (var i in d) {
                                $('[data-role='+key+'List]').append('<option value="' + d[i].optionId + '">' + d[i].selectValue + '</option>');
                            }
                        }

                        form.render();

                        resolve();
                    }
                });
            });
        }
        //学期下拉框数据渲染
        function renderTermSelect() {
            return new Promise((resolve) => {
                getTermData({},function(res){
                    if(res.code == 1){
                        $('[data-role=termList]').empty().append('<option value="">请选择</option>');
                        for(var i in res.data){
                            $('[data-role=termList]').append('<option value="'+res.data[i].id+'">'+res.data[i].title+'</option>');
                        }

                        form.render('select');

                        resolve();
                    }
                });
            });
        }
        //年级下拉框数据渲染
        function renderGradesSelect() {
            return new Promise((resolve) => {
                getDictionaryXmSelect({'diccode': ['GRADE']},function(res){
                    if(res.code == 1){
                        xmGradeDemo = xmSelect.render({
                            el: '#grades',
                            autoRow: true,
                            filterable: true,
                            tree: {
                                show: true,
                                showFolderIcon: true,
                                showLine: true,
                                indent: 20,
                                expandedKeys:false
                            },
                            direction: 'down',
                            filterable: true,
                            height: 'auto',
                            name:'grade_item',
                            layVerify: 'required',
                            layVerType: 'msg',
                            layReqText:'年级不能为空',
                            theme: {
                                color: '#2d8cf0',
                            },
                            searchTips:'关键字搜索',
                            data: function(){
                                return res.data.GRADE
                            }
                        })

                        return resolve();
                    }
                });
            });
        }
        //参与教师下拉框数据渲染
        function renderClassesSelect() {
            return new Promise((resolve) => {
                getDictionaryXmSelect({'diccode': ['CLASSITEM']},function(res){
                    if(res.code == 1){
                        xmDemo = xmSelect.render({
                            el: '#classes',
                            autoRow: true,
                            filterable: true,
                            tree: {
                                show: true,
                                showFolderIcon: true,
                                showLine: true,
                                indent: 20,
                                expandedKeys:false
                            },
                            direction: 'down',
                            filterable: true,
                            height: 'auto',
                            name:'class_item',
                            layVerify: 'required',
                            layVerType: 'msg',
                            layReqText:'班级不能为空',
                            theme: {
                                color: '#2d8cf0',
                            },
                            searchTips:'关键字搜索',
                            data: function(){
                                return res.data.classItem
                            }
                        })

                        return resolve();
                    }
                });
            });
        }
        //教师姓名下拉框数据渲染
        function renderCompere() {
            return new Promise((resolve) => {
                getParticipantsData({},function(res){
                    if(res.code == 1){
                        cxmDemo = xmSelect.render({
                            el: '#cter',
                            radio: true,
                            autoRow: true,
                            filterable: true,
                            tree: {
                                show: true,
                                showFolderIcon: true,
                                showLine: true,
                                indent: 20,
                                expandedKeys:false
                            },
                            direction: 'down',
                            filterable: true,
                            height: 'auto',
                            name:'user_id',
                            layVerify: 'required',
                            layVerType: 'msg',
                            layReqText:'教师姓名不能为空',
                            theme: {
                                color: '#2d8cf0',
                            },
                            searchTips:'关键字搜索',
                            data: function(){
                                return res.data
                            }
                        })

                        return resolve();
                    }
                });
            });
        }

        //数据渲染
        function pageInit(){
            getDisciplineOne({id:PageId}, function(res) {
                if(res.code === 1) {
                    let Discipline = res.data;

                    form.val('editForm', {
                        'id': PageId,
                        'data_version_id': Discipline.data_version_id,
                        'class_hour': Discipline.class_hour,
                        'start_date': Discipline.start_date,
                        'end_date': Discipline.end_date,
                        'subject_dic_items': Discipline.subject_set[0].optionId,
                        'subject_name': Discipline.subject_name,
                        'grade_dic_items': Discipline.grade_set.grade_items[0].optionId,
                        'class_item': Discipline.class_set.class_items[0].optionId,
                        'master':  Discipline.master,
                        'deputy_master':  Discipline.deputy_master
                    });

                    cxmDemo.setValue([Discipline.user_id]);
                    //年级
                    // xmGradeDemo.setValue(Discipline.grade_set.grade_dic_ids);
                    //班级
                    // xmDemo.setValue(Discipline.class_set.class_dic_ids);

                    form.render();
                } else {
                    layer.msg('无数据记录', {time: 2000, icon: 5});
                }
            });
        }

        //提交
        form.on('submit(sub)', function(data){
            let d = data.field;
            // d.class_dic_ids = xmDemo.getValue('value');
            // d.grade_dic_ids = xmGradeDemo.getValue('value');

            editDiscipline(d, function(res){
                if(res.code == '1'){
                    layer.msg(res.msg,{icon: 6,time: 1000},function(){
                        window.history.back();
                    });
                }else{
                    layer.msg(res.msg, {icon: 5,shift : 6});
                }
            });

            return false;
        });
    });
</script>
@endpush

@section('content')
<style>
    .opt-panel{padding: 10px;}
    .panel-title h3{margin-bottom: 20px;font-weight: 800;}

    .opt-form{padding: 20px 5px;}
    .opt-area{display: flex;flex-direction: row-reverse;padding: 2% 6%;;margin-bottom: 20px;}
    .opt-area button, .back-btn{margin-left: 10px;}
</style>

<div class="layui-row">
    <div class="layui-panel opt-panel">
        <form class="layui-form opt-form" action="" id="edit-form" lay-filter="editForm">
            <div class="layui-row">
                <div class="panel-title">
                    <h3>任教学科 - 编辑</h3>
                </div>

                <div class="layuik-form-item layuik-columns-two">
                    <div class="layuik-inline">
                        <label class="layuik-form-label"><i class="redstar">*</i>学年学期：</label>
                        <div class="layuik-input-inline">
                            <select class="data-version-id" name="data_version_id" lay-filter="termList" data-role="termList" lay-verify="required" lay-reqText="不能为空"></select>
                        </div>
                    </div>
                    <div class="layuik-inline">
                        <label class="layuik-form-label"><i class="redstar">*</i>学科：</label>
                        <div class="layuik-input-inline">
                            <select name="subject_dic_items" lay-filter="subjectList" data-role="subjectList" lay-verify="required" lay-reqText="不能为空"></select>
                        </div>
                    </div>

                </div>
                <div class="layuik-form-item layuik-columns-two">

                    <div class="layuik-inline">
                        <label class="layuik-form-label">科目名称：</label>
                        <div class="layuik-input-inline">
                            <input type="text" name="subject_name" placeholder="请输入" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layuik-inline">
                        <label class="layuik-form-label"><i class="redstar">*</i>课时：</label>
                        <div class="layuik-input-inline">
                            <input type="text" name="class_hour" id="class-hour" required lay-verify="required|number" placeholder="请填写" lay-reqText="不能为空" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <div class="layuik-form-item layuik-columns-two">
                    <div class="layuik-inline">
                        <label class="layuik-form-label"><i class="redstar">*</i>开始日期：</label>
                        <div class="layuik-input-inline">
                            <input type="text" name="start_date" id="start-date" required lay-verify="required" placeholder="请选择" lay-reqText="不能为空" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layuik-inline">
                        <label class="layuik-form-label"><i class="redstar">*</i>结束日期：</label>
                        <div class="layuik-input-inline">
                            <input type="text" name="end_date" id="end-date" required lay-verify="required" placeholder="请选择" lay-reqText="不能为空" autocomplete="off" class="layui-input">
                        </div>
                    </div>

                </div>

                <div class="layuik-form-item layuik-columns-two">
                    <div class="layuik-inline">
                        <label class="layuik-form-label"><i class="redstar">*</i>教师姓名：</label>
                        <div class="layuik-input-inline">
                            <div type="text" id="cter" class="xm-select-demo"></div>
                        </div>
                    </div>

                    <div class="layuik-inline">
                        <label class="layuik-form-label"><i class="redstar">*</i>班主任：</label>
                        <div class="layuik-input-inline">
                            <select name="master" lay-verify="required" lay-reqText="不能为空">
                                <option value="">请选择</option>
                                <option value="是">是</option>
                                <option value="否">否</option>
                            </select>
                        </div>
                    </div>

                </div>
                <div class="layuik-form-item layuik-columns-two">
                    <div class="layuik-inline">
                        <label class="layuik-form-label"><i class="redstar">*</i>副班主任：</label>
                        <div class="layuik-input-inline">
                            <select name="deputy_master" lay-verify="required" lay-reqText="不能为空">
                                <option value="">请选择</option>
                                <option value="是">是</option>
                                <option value="否">否</option>
                            </select>
                        </div>
                    </div>
                    <div class="layuik-inline">
                        <label class="layuik-form-label"><i class="redstar">*</i>年级：</label>
                        <div class="layuik-input-inline">
                            <!-- <div type="text" id="grades" class="xm-select-grade"></div> -->
                            <select name="grade_dic_items" lay-filter="gradeList" data-role="gradeList" lay-verify="required" lay-reqText="不能为空"></select>
                        </div>
                    </div>

                </div>
                <div class="layuik-form-item layuik-columns-two">
                    <div class="layuik-inline">
                        <label class="layuik-form-label"><i class="redstar">*</i>班级：</label>
                        <div class="layuik-input-inline">
                            <!-- <div type="text" id="classes" class="xm-select-class"></div> -->
                            <select name="class_item" lay-filter="classList" data-role="classList" lay-verify="required" lay-reqText="不能为空"></select>
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-row">
                <div class="opt-area">
                    <a href="javascript:history.go(-1);" class="layui-btn layui-btn-primary back-btn">返回</a>
                    <button class="layui-btn layui-btn-normal" lay-submit lay-filter="sub">提交</button>
                    <input type="hidden" name="id" value="0">
                </div>
            </div>
        </form>
    </div>
</div>

@endsection
